<template>
    <div>
      <button id="btnUpFile1">上传</button>
      <span id="spanProgress"></span>
    </div>
</template>

<script>
  import OSS from 'ali-oss';
  import {zcAliFile} from '../common/zcAliFile';

  export default {
    name: 'UpLoad',
    data(){
      return {
        FileIndex:1
      }
    },
    methods:{
      myUpingProgress(percent){
        document.getElementById('spanProgress').innerText='完成:'+percent;
      },
      myUpingSuccess(res){
        console.log('myUpingSuccess',res);
      },
      myUpingError(e){
        console.log('err',e);
      }
    },
    mounted(){
      let me = this;
      zcAliFile.doInit({
        AliOss:OSS,
        OssCfg:{
          AppId:'LTAItVNI8d5WCDZB',
          Secret:'GcARvstYiqWQyCAbXcQbKrv7qwomUT',
          Bucket:'zcsoft-education',
          Region:'oss-cn-qingdao',
          DirName:'tzc2'
         },
        FileCfg:{
          ButtonId:'btnUpFile1',
          Accept:'image/*',
          ExtName:'.jpg,.png,.gif'
        },
        cbUpingProgress:me.myUpingProgress,
        cbUpingSuccess:me.myUpingSuccess,
        cbUpingError:me.myUpingError,
        Scope:me
      });
    }
  };
</script>

<style scoped>
  .zcUpload{
    height: 72px;
    width: 72px;
    background: url("../assets/cloud_upload_72.png") no-repeat;
  }
  .zcFile-hide{
    display: none;
  }
</style>
